<template>
	<view class="home">

		<view class="header_top"></view>

		<!--头像区域-->
		<view class="header">

			<view class="header_left" style="margin-top: 40px;">
				<text style="font-weight: bold;margin-left: 10px;font-size: 18px;">{{ nickname }}</text>
			</view>

			<!-- <view class="header_right">
				<image :src="avatar"></image>
			</view> -->

			<view class="header_right">
				<!-- 修改后的头像显示逻辑 -->
				<view v-if="avatar" class="avatar-container">
					<image :src="avatar" style="width: 70px;height: 70px;border-radius: 50%;"></image>
				</view>
				<view v-else class="avatar-placeholder" @click="uploadAvatar">
					<text class="placeholder-text">请上传头像</text>
					<text class="required-mark">*</text>
				</view>
			</view>

		</view>


		<!--资料详情-->
		<view class="zl_down" style="margin-top: 10px;height: 150px;margin: 0px 10px;">
			<view class=""
				style="padding-top: 20px;padding-left: 20px;font-weight: bold;color: #4D4D4D;padding-bottom: 30px;display: flex;">
				<view><text>个人照片</text></view>
			</view>

			<view class="zl_c">
				<view class="zl_c_d" style="display: flex; padding-left: 5px;">
					<view name="image[]" @click="get_img()"
						style="width: 50px;height: 50px;background-color: #F2F2F2;margin-left:8px;text-align: center;">
						<text style="color: #C4C4C4;font-size: 34px;">+</text>
					</view>
					<view v-for="(item, index) in tempFiles" :key="index"
						style="width: 50px;height: 50px;margin-left: 10px; display: none;">
						<view class="upload_img_item">

							<view style="width: 50px;height: 50px;border:1px solid #F5F5F5;border-radius: 10px;">

								<image :src="item.path" class="upload_img" style="width: 50px;height: 50px;"></image>
							</view>

						</view>
					</view>
					<view v-for="(item, index) in (swipers || [])" :key="index"
						style="width: 50px;height: 50px;margin-left: 10px;">
						<view class="upload_img_item" v-if="item && item.pic">

							<view
								style="width: 50px;height: 50px;border:1px solid #F5F5F5;border-radius: 10px;position:absolute">

								<image :src="item.pic" class="upload_img" style="width: 50px;height: 50px;"></image>
							</view>

							<view class="" @click="img_delete2(index)" style="position: relative;font-size: 16px;color: #000000;left:50px; top:-10px">X</view>
						</view>
					</view>
				</view>

			</view>

		</view>


		<!--资料详情-->
		<view class="zl_down" style="margin-top: 10px;height: 800px;">
			<view class=""
				style="padding-top: 20px;padding-left: 20px;font-weight: bold;color: #4D4D4D;padding-bottom: 30px;">
				<text>基本资料</text>
			</view>

			<view class="zl_c">
				<view class="zl_c_d"><text style="font-size: 14px;color: #4D4D4D;">昵称</text></view>

				<view class="zl_c_f"><input name="nickname" v-model="nickname" /></view>

				<view class="zl_c_e">
					<view class="iconfont icon-bianji"></view>
				</view>
			</view>


			<hr style="height:1px;border:none;border-top:1px dashed #DADCE0;width: 90%;margin: 10px auto;">

			<view class="zl_c" style="padding-top: 10px;">
				<view class="zl_c_d"><text style="font-size: 14px;color: #4D4D4D;">性别</text></view>

				<view class="zl_c_f">
					<view class="uni-form-item uni-column">
						<picker @change="sexPickerChange" :range="s_sex">
							<label class="">{{ s_sex[index1] }}</label>
						</picker>
					</view>
				</view>

				<view class="zl_c_e">
					<view class="iconfont icon-bianji"></view>
				</view>

			</view>

			<hr style="height:1px;border:none;border-top:1px dashed #DADCE0;width: 90%;margin: 10px auto;">

			<view class="zl_c" style="padding-top: 10px;">
				<view class="zl_c_d"><text style="font-size: 14px;color: #4D4D4D;">出生日期</text></view>
				<view class="zl_c_f">
					<view class="uni-form-item uni-column" @click="borth()" v-if="birth_status">
						<text style="float: left;">请选择</text>
					</view>

					<view class="uni-form-item uni-column" @click="borth()" v-else>
						<text>{{ birth }}</text>
					</view>

					<view class="uni-form-item uni-column">
						<birthTime :class="{ active: show }" @confirm="confirm" @cancel="show = false"></birthTime>
					</view>
				</view>
				<view class="zl_c_e">
					<view class="iconfont icon-bianji"></view>
				</view>
			</view>

			<hr style="height:1px;border:none;border-top:1px dashed #DADCE0;width: 90%;margin: 10px auto;">

			<view class="zl_c" style="padding-top: 10px;">

				<view class="zl_c_d"><text style="font-size: 14px;color: #4D4D4D;">身高</text></view>
				<view class="zl_c_f">
					<view class="uni-form-item uni-column">
						<picker @change="shengaoPickerChange" :range="sg">
							<label class="">{{ sg[index2] }}</label>
						</picker>
					</view>
				</view>

				<view class="zl_c_e">
					<view class="iconfont icon-bianji"></view>
				</view>
			</view>

			<hr style="height:1px;border:none;border-top:1px dashed #DADCE0;width: 90%;margin: 10px auto;">

			<view class="zl_c" style="padding-top: 10px;">

				<view class="zl_c_d"><text style="font-size: 14px;color: #4D4D4D;">体重</text></view>
				<view class="zl_c_f">
					<view class="uni-form-item uni-column">
						<picker @change="tizongPickerChange" :range="tz">
							<label class="">{{ tz[index3] }}</label>

						</picker>
					</view>

				</view>

				<view class="zl_c_e">
					<view class="iconfont icon-bianji"></view>
				</view>
			</view>

			<hr style="height:1px;border:none;border-top:1px dashed #DADCE0;width: 90%;margin: 10px auto;">

			<view class="zl_c" style="padding-top: 10px;">

				<view class="zl_c_d"><text style="font-size: 14px;color: #4D4D4D;">所在地</text></view>
				<view class="zl_c_f">
					<view class="content" @click="open">

						<label v-if="seen">{{ address }}</label>
						<label v-else>请选择</label>

					</view>
				</view>
				<cityPicker :defaultValue="defaultValue" :mask-close-able="maskCloseAble" @confirm="confirm2"
					@cancel="cancel" :visible="visible" />

				<view class="zl_c_e">
					<view class="iconfont icon-bianji"></view>
				</view>
			</view>

			<hr style="height:1px;border:none;border-top:1px dashed #DADCE0;width: 90%;margin: 10px auto;">


			<view class="zl_c" style="padding-top: 10px;">

				<view class="zl_c_d"><text style="font-size: 14px;color: #4D4D4D;">故乡</text></view>
				<view class="zl_c_f">
					<view class="content" @click="open2">

						<label v-if="seen2">{{ address2 }}</label>
						<label v-else>请选择</label>

					</view>
				</view>
				<cityPicker :defaultValue="defaultValue2" :mask-close-able="maskCloseAble2" @confirm="confirm3"
					@cancel="cancel2" :visible="visible2" />

				<view class="zl_c_e">
					<view class="iconfont icon-bianji"></view>
				</view>
			</view>

			<hr style="height:1px;border:none;border-top:1px dashed #DADCE0;width: 90%;margin: 10px auto;">
			<view>
				<view class="zl_c_d" style="padding-top: 10px;margin-left: 20px;">
					<text style="font-size: 14px;color: #4D4D4D;">关于我</text>
				</view>
				<view class="zl_c_f" style="margin-left:20px ;">

					<textarea @blur="bindTextAreaBlur" name="about_me" v-model="about_me" auto-height>
					</textarea>

				</view>
			</view>

			<hr style="height:1px;border:none;border-top:1px dashed #DADCE0;width: 90%;margin: 10px auto;">

			<view class="zl_c" style="padding-top: 10px;">

				<view class="zl_c_d"><text style="font-size: 14px;color: #4D4D4D;">月收入</text></view>
				<view class="zl_c_f">
					<view class="uni-form-item uni-column">
						<picker @change="shouruPickerChange" :range="sr">
							<label class="">{{ sr[index4] }}</label>
						</picker>
					</view>
				</view>

				<view class="zl_c_e">
					<view class="iconfont icon-bianji"></view>
				</view>
			</view>

			<hr style="height:1px;border:none;border-top:1px dashed #DADCE0;width: 90%;margin: 10px auto;">
			<view class="zl_c" style="padding-top: 10px;">

				<view class="zl_c_d"><text style="font-size: 14px;color: #4D4D4D;">学历</text></view>
				<view class="zl_c_f">
					<view class="uni-form-item uni-column">
						<picker @change="xueliPickerChange" :range="xl">
							<label class="">{{ xl[index5] }}</label>
						</picker>
					</view>
				</view>

				<view class="zl_c_e">
					<view class="iconfont icon-bianji"></view>
				</view>
			</view>

			<hr style="height:1px;border:none;border-top:1px dashed #DADCE0;width: 90%;margin: 10px auto;">

			<view class="zl_c" style="padding-top: 10px;">

				<view class="zl_c_d"><text style="font-size: 14px;color: #4D4D4D;">婚姻状况</text></view>
				<view class="zl_c_f">
					<view class="uni-form-item uni-column">
						<picker @change="hunyingPickerChange" :range="hy">
							<label class="">{{ hy[index6] }}</label>
						</picker>
					</view>
				</view>

				<view class="zl_c_e">
					<view class="iconfont icon-bianji"></view>
				</view>
			</view>

			<hr style="height:1px;border:none;border-top:1px dashed #DADCE0;width: 90%;margin: 10px auto;">

			<view class="zl_c" style="padding-top: 10px;padding-bottom: 100px;">

				<view class="zl_c_d"><text style="font-size: 14px;color: #4D4D4D;">职业</text></view>
				<view class="zl_c_f">
					<view class="uni-form-item uni-column">
						<picker @change="zyPickerChange" :range="zy">
							<label class="">{{ zy[index7] }}</label>
						</picker>
					</view>
				</view>

				<view class="zl_c_e">
					<view class="iconfont icon-bianji"></view>
				</view>
			</view>


			<view style="margin: 0px 10px;bottom:20px;position:fixed;bottom:10px;width: 90%;">
				<view class="bnt" @click="bnt()">
					<button type="default" style="background-color: #F14399;color: #fff;">保存</button>
				</view>
			</view>
		</view>


	</view>
</template>


<script>
import helper from '.../../common/helper.js';
import cityPicker from '.../../components/piaoyi-cityPicker/pioayi-cityPicker.vue'
import birthTime from '.../../../components/birth-date-plug/index.vue'
import { BASE_URL } from '@/util/api';
export default {
	//注册组件
	components: {
		cityPicker,
		birthTime,//出生日期
	},
	data() {
		return {
			status: "",
			products: {},//头像显示

			seen3: false,//性别显示
			nickname: "",//呢称
			sex: "",//性别
			age: "",//出生日期
			height: "",//身高
			weight: "",//体重
			avatar: "",//头像

			occupation: "",//职业
			hunyin_status: "",//婚姻状况
			monthly_income: "",//月收入
			about_me: "",//关于我

			//上传图片
			tempFiles: [],
			uploadList: [],
			img_status: false,
			imgAllUrl: [],


			birth_status: false,

			show: false,
			birth: 0,

			s_sex: ['请选择', '男', '女'],
			sg: ['请选择', '150cm', '151cm', '152cm', '153cm', '154cm', '155cm', '156cm', '157cm', '158cm', '159cm', '160cm', '161cm', '162cm', '163cm', '164cm', '165cm', '166cm', '167cm', '168cm', '169cm', '170cm', '171cm', '172cm', '173cm', '174cm', '175cm', '176cm', '177cm', '178cm', '179cm', '180cm', '181cm', '182cm', '183cm', '185cm', '186cm', '187cm', '188cm', '189cm', '190cm', '190cm以上'],
			tz: ['请选择', '38kg', '39kg', '40kg', '41kg', '42kg', '43kg', '44kg', '45kg', '46kg', '47kg', '48kg', '49kg', '50kg', '51kg', '52kg', '53kg', '54kg', '55kg', '56kg', '57kg', '58kg', '59kg', '60kg', '61kg', '62kg', '63kg', '64kg', '65kg', '66kg', '67kg', '68kg', '69kg', '70kg', '71kg', '72kg', '73kg', '74kg', '75kg', '76kg', '77kg', '78kg', '79kg', '80kg', '81kg', '82kg', '83kg', '84kg', '85kg', '86kg', '87kg', '88kg', '89kg', , '90kg', '91kg', '92kg', '93kg', '94kg', '95kg', '96kg', '97kg', '98kg', '99kg', '100kg', '100kg以上'],
			sr: ['请选择', '3000-5000', '5000-8000', '1万-2万', '2-3万', '3万|以上'],
			xl: ['请选择', '初中|以上', '高中|以上', '大学|以上', '研究生|以上'],
			hy: ['请选择', '未婚', '离异', '其他'],
			zy: ['请选择', '运动员', '教师', '教授', '学生', '董事长', '总经理', '副总/总监', '部门经理', '中层管理', '企业家', '个体老板', '高级干部', '公务员', '律师', '医生', '护士', '专家学者', '工程师', '设计师', '艺术家', '演员', '模特', '离/退休', '技术员', '服务员', '普通员工', '自由职业', '无业', '程序员'],
			index1: 0,
			index2: 0,
			index3: 0,
			index4: 0,
			index5: 0,
			index6: 0,
			index7: 0,
			// 初始化swipers为空数组
			swipers: [],

			//所在地
			visible: false,
			maskCloseAble: true,
			str: '',
			defaultValue: '',
			address: '请选择',
			seen: true,

			//故乡
			visible2: false,
			maskCloseAble2: true,
			str2: '',
			defaultValue2: '',
			address2: '请选择',
			seen2: true,
		}
	},

	onLoad(options) {
		this.id = options.id
		this.xiangqing()
		this.images_show()
	},

	methods: {


		uploadAvatar() {
			uni.chooseImage({
				count: 1,
				sizeType: ['compressed'],
				sourceType: ['album'],
				success: (res) => {
					const tempFilePaths = res.tempFilePaths;
					// 这里可以添加头像上传逻辑
					uni.uploadFile({
						url: BASE_URL + '/index/dsnv.activities/uploadimage',
						filePath: tempFilePaths[0],
						name: 'file',
						success: (uploadRes) => {
							const data = JSON.parse(uploadRes.data);
							if (data.code === 200) {
								this.avatar = data.url; // 更新头像URL
								uni.showToast({
									title: '头像上传成功',
									icon: 'success'
								});
							}
						}
					});
				}
			});
		},

		//显示数据库图片
		async images_show() {
			try {
				const res = await this.$myRuquest({
					url: '/index/dsnv.activities/images_show?id=' + this.id
				});

				// 双重确保是数组
				this.swipers = Array.isArray(res.data?.date) ? res.data.date : [];
			} catch (error) {
				console.error('获取图片失败:', error);
				this.swipers = [];
			}
		},

		async xiangqing() {

			const res = await this.$myRuquest({
				url: 'index/dsnv.activities/zhiliao_edit',
				method: 'post',
				data: {
					"id": this.id,
				},
			})
			if (res.data.code == 200) {

				const date = res.data.date || {};
				this.status = date.status || "";
				this.avatar = date.avatar || "";
				this.nickname = date.nickname || "";

				if (this.status == 2) {
					this.s_sex = [date.sex];//性别
					this.address2 = date.hometown//故乡
				} else {
					if (date.sex == 0) {
						this.s_sex = ['请选择', '男', '女'];
					} else {
						this.s_sex = [date.sex, '男', '女'];
					}
					if (date.hometown == 0) {
						this.seen2 = false
					} else {
						this.address2 = date.hometown
					}

				}



				this.birth = date.age

							
				// 修改身高处理逻辑
				const defaultSg = ['请选择', '150cm', '151cm', '152cm', '153cm', '154cm', '155cm', '156cm', '157cm', '158cm', '159cm', '160cm', '161cm', '162cm', '163cm', '164cm', '165cm', '166cm', '167cm', '168cm', '169cm', '170cm', '171cm', '172cm', '173cm', '174cm', '175cm', '176cm', '177cm', '178cm', '179cm', '180cm', '181cm', '182cm', '183cm', '185cm', '186cm', '187cm', '188cm', '189cm', '190cm', '190cm以上'];
				
				if (date.height && date.height !== '0') {
					// 确保新数组包含所有选项
					this.sg = [date.height, ...defaultSg.filter(item => item !== date.height && item !== '请选择')];
					// 设置选中项的索引
					this.index2 = this.sg.indexOf(date.height) >= 0 ? this.sg.indexOf(date.height) : 0;
				} else {
					this.sg = defaultSg;
					this.index2 = 0;
				}

				if (date.weight == 0) {
					this.tz = ['请选择', '30kg', '31kg', '32kg', '33kg', '34kg', '35kg','36kg','37kg','38kg', '39kg', '40kg', '41kg', '42kg', '43kg', '44kg', '45kg', '46kg', '47kg', '48kg', '49kg', '50kg', '51kg', '52kg', '53kg', '54kg', '55kg', '56kg', '57kg', '58kg', '59kg', '60kg', '61kg', '62kg', '63kg', '64kg', '65kg', '66kg', '67kg', '68kg', '69kg', '70kg', '71kg', '72kg', '73kg', '74kg', '75kg', '76kg', '77kg', '78kg', '79kg', '80kg', '81kg', '82kg', '83kg', '84kg', '85kg', '86kg', '87kg', '88kg', '89kg', , '90kg', '91kg', '92kg', '93kg', '94kg', '95kg', '96kg', '97kg', '98kg', '99kg', '100kg', '100kg以上'];
				} else {
					this.tz = [date.weight, '30kg', '31kg', '32kg', '33kg', '34kg', '35kg','36kg','37kg', '38kg', '39kg', '40kg', '41kg', '42kg', '43kg', '44kg', '45kg', '46kg', '47kg', '48kg', '49kg', '50kg', '51kg', '52kg', '53kg', '54kg', '55kg', '56kg', '57kg', '58kg', '59kg', '60kg', '61kg', '62kg', '63kg', '64kg', '65kg', '66kg', '67kg', '68kg', '69kg', '70kg', '71kg', '72kg', '73kg', '74kg', '75kg', '76kg', '77kg', '78kg', '79kg', '80kg', '81kg', '82kg', '83kg', '84kg', '85kg', '86kg', '87kg', '88kg', '89kg', , '90kg', '91kg', '92kg', '93kg', '94kg', '95kg', '96kg', '97kg', '98kg', '99kg', '100kg', '100kg以上'];
				}


				if (date.address == 0) {
					this.seen = false
				} else {
					this.address = date.address
				}

				this.about_me = date.about_me

				if (date.monthly_income == 0) {
					this.sr = ['请选择', '3000-5000', '5000-8000', '1万-2万', '2-3万', '3万|以上'];
				} else {
					this.sr = [date.monthly_income, '3000-5000', '5000-8000', '1万-2万', '2-3万', '3万|以上'];
				}

				// console.log(date.education == null);

				if (date.education == 0 || date.education == null) {
					this.xl = ['请选择', '初中|以上', '高中|以上', '大学|以上', '研究生|以上'];
				} else {
					this.xl = [date.education, '初中|以上', '高中|以上', '大学|以上', '研究生|以上'];
				}

				if (date.occupation == 0 || date.occupation == null) {
					this.zy = ['请选择', '运动员', '教师', '教授', '学生', '董事长', '总经理', '副总/总监', '部门经理', '中层管理', '企业家', '个体老板', '高级干部', '公务员', '律师', '医生', '护士', '专家学者', '工程师', '设计师', '艺术家', '演员', '模特', '离/退休', '技术员', '服务员', '普通员工', '自由职业', '无业', '程序员'];
				} else {
					this.zy = [date.occupation, '运动员', '教师', '教授', '学生', '董事长', '总经理', '副总/总监', '部门经理', '中层管理', '企业家', '个体老板', '高级干部', '公务员', '律师', '医生', '护士', '专家学者', '工程师', '设计师', '艺术家', '演员', '模特', '离/退休', '技术员', '服务员', '普通员工', '自由职业', '无业', '程序员'];
				}

				if (date.hunyin_status == 0 || date.hunyin_status == null) {
					this.hy = ['请选择', '未婚', '离异', '其他'];
				} else {
					this.hy = [date.hunyin_status, '未婚', '离异', '其他'];
				}

			} else {
				uni.showToast({
					title: info,
					duration: 3000,
					icon: 'none'
				})
			}

		},
		get_img() {
			const _self = this;
			uni.chooseImage({
				count: 1, //默认9
				sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有
				sourceType: ['album'], //从相册选择
				success: function (res) {

					var tempFiles = res.tempFiles; //显示的图片
					var tempFilePaths = res.tempFilePaths; //上传的图片
					//处理需要上传的图片
					for (var i = 0; i < tempFilePaths.length; i++) {
						_self.uploadList.push(tempFilePaths[i]);
					}
					_self.do_upload();
				}
			});

		},
		//删除数据库图片

		async img_delete2(e) {

			const res = await this.$myRuquest({
				url: '/index/dsnv.activities/img_delete2?index=' + e + '&id=' + this.id
			})

			if (res.data.code == 200) {
				this.$router.go(0);
			}

		},

		do_upload() {

			// var my_ziliao = uni.getStorageSync('my_ziliao');
			// console.log(my_ziliao)
			// this.id = my_ziliao.id;
			var that = this;
			const img_list = this.uploadList;
			var i = 0;

			for (i; i < img_list.length; i++) {
				const uploadTask = uni.uploadFile({
					url: BASE_URL + '/index/dsnv.activities/uploadimages?id=' + this.id,
					filePath: img_list[i],
					fileType: 'image',
					name: 'file',
					success: (res) => {
						this.seen3 = true;
						uni.showToast({
							title: "图片已上传成功",
							duration: 1000,
							icon: 'none'
						})
						this.$router.go(0)
					}
				});
			}

		},

		async out() {
			setTimeout(() => {
				uni.clearStorage()
				this.$router.go(0)
				uni.navigateTo({
					url: '/pages/login/login'
				});
			}, 400)
		},


		//性别
		sexPickerChange: function (e) {
			this.index1 = e.target.value
		},
		//身高
		shengaoPickerChange: function (e) {
			this.index2 = e.target.value
		},
		//体重
		tizongPickerChange: function (e) {
			this.index3 = e.target.value
		},
		//收入
		shouruPickerChange: function (e) {
			this.index4 = e.target.value
		},
		//学历
		xueliPickerChange: function (e) {
			this.index5 = e.target.value
		},
		//婚姻情况
		hunyingPickerChange: function (e) {

			this.index6 = e.target.value
		},
		//职业
		zyPickerChange: function (e) {
			this.index7 = e.target.value
		},

		confirm(date) {
			this.show = false;
			this.birth = date;
			this.birth_status = false;
		},

		//出生日期
		borth() {
			if (this.status == 2) {
				this.show = false;
			} else {
				this.show = true;
			}
		},

		//所在地
		open() {
			this.visible = true
		},
		async bnt() {
			let relativePath = this.avatar.replace(/^https?:\/\/[^\/]+/, '');
			// console.log(this.avatar) // http://ds1.kzjpht.com/public/upload/zip_pic/20250424/cbeccf8b14a39f2aa9636e05ac6612c9.png
			// return
			if (!relativePath) {
				uni.showToast({
					title: '请上传头像',
					icon: 'none',
					duration: 2000
				});
				return;
			}
			var index1 = this.index1;
			var index2 = this.index2;
			var index3 = this.index3;
			var index4 = this.index4;
			var index5 = this.index5;
			var index6 = this.index6;
			var index7 = this.index7;

			const res = await this.$myRuquest({
				url: 'index/dsnv.activities/zhiliao_edit2',
				method: 'post',
				data: {
					"id": this.id,
					"avatar": relativePath,
					"nickname": this.nickname,//呢称
					"sex": this.s_sex[index1],//性别
					"height": this.sg[index2],//身高
					"weight": this.tz[index3],//体重
					"monthly_income": this.sr[index4],//收入
					"education": this.xl[index5],//学历
					"hunyin_status": this.hy[index6],//婚姻状态
					"occupation": this.zy[index7],//职业
					"age": this.birth,//出生日期
					"address": this.address,//所在地
					"hometown": this.address2,//故乡
					"about_me": this.about_me,//关于我
				},

			})

			if (res.data.code == 200) {

				setTimeout(() => {
					uni.showToast({
						title: "保存成功",
						duration: 3000,
						icon: 'none'
					})
				}, 400)

			} else {
				uni.showToast({
					title: "失败",
					duration: 3000,
					icon: 'none'
				})
			}

		},
		confirm2(val) {

			this.seen = true
			this.str = val
			this.visible = false
			this.address = val.name
		},
		cancel() {
			this.visible = false
		},

		//故乡
		open2() {
			if (this.status == 2) {
				this.visible2 = false;
			} else {
				this.visible2 = true;
			}
		},
		confirm3(val) {
			this.seen2 = true
			this.str2 = val
			this.visible2 = false
			this.address2 = val.name
		},
		cancel2() {
			this.visible2 = false
		},

	}
}



</script>

<style lang="scss">
.home {
	height: 1150px;
	background-color: #F6F6F6;
	font-size: 13px;

	textarea {
		font-size: 11px;
		width: 90%;
	}

	.header_top {
		margin-bottom: 20px;

	}

	//头像
	.header {
		background-color: #fff;
		margin: 0 10px;
		display: flex;
		height: 100px;
		margin-bottom: 10px;
		border-radius: 10px;

		.header_left {
			width: 100%;
		}

		.header_right {

			padding-right: 20px;
			padding-top: 8px;

			image {
				margin-left: 10px;
				margin-top: 10px;
				width: 70px;
				height: 70px;
				border-radius: 50%;
			}
		}

		.header_rt {
			margin-left: 5%;
			margin-top: 45px;
		}


	}

	.zl_down {
		background-color: #fff;
		margin: 0 10px;

		border-radius: 10px;

		.zl_c {
			display: flex;
			padding-left: 20px;

			.zl_c_d {
				margin-top: 6px;
				margin-left: 5px;
				width: 80%;
			}

			.zl_c_f {
				text {
					float: right;
				}

				width: 20%;
				margin-top: 5px;
			}

			.zl_c_e {
				margin-left: 3px;
				padding-right: 20px;
				margin-top: 8px;
			}
		}
	}
}

.home {
	/* 保持原有样式不变 */

	/* 新增头像相关样式 */
	.avatar-container {
		width: 70px;
		height: 70px;
		margin-left: 10px;
		margin-top: 10px;
	}

	.avatar-placeholder {
		width: 70px;
		height: 70px;
		border: 1px dashed #C4C4C4;
		border-radius: 50%;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		margin-left: 10px;
		margin-top: 10px;
		background-color: #F2F2F2;
		position: relative;
	}

	.placeholder-text {
		color: #999;
		font-size: 12px;
		text-align: center;
	}

	.required-mark {
		color: red;
		position: absolute;
		top: -5px;
		right: -5px;
		font-size: 16px;
	}
}
</style>
